import React from 'react';
import { NavBar, Icon } from 'antd-mobile';
// 引入插件
import IndexBar from '../../components/IndexBar/IndexBar';
class CityList extends React.Component {
    state={
        city:[],// 城市列表
        isLoad:0// 是否获得到数据
    }
    render() { 
        return <div>
            <NavBar
            mode="light"
            icon={<Icon type="left" />}
            onLeftClick={() =>{this.props.history.go(-1)}}          
            >城市列表</NavBar>

            {/* 渲染列表 */}

            {
                this.state.isLoad?
                <IndexBar 
                data={this.state.city}
                height={window.screen.height-50}
                sidegl="pink"
                egz={(v)=>{
                    console.log(v);
                    // 获取选中城市的信息 存到本地存储 
                    localStorage.setItem("cityinfo",JSON.stringify(v))
                    this.props.history.go(-1)
                }}
                 />
                :''
            }
        </div>;
    }
    init(){
        // console.log(this.axios);
        // return
        this.api.getCityList()
        .then(res=>{
            console.log(res);
            if(res.data.code==200){
                this.setState({
                    city:res.data.msg,
                    isLoad:1
                })
            }
        })
    }

    componentDidMount(){
        this.init()
    }
}
 
export default CityList;
// indexbar  索引导航
// data 数据
// hegight 高度
// sidegl 索引高亮 可选 
// egz 函数 点击 选项 回调的函数
// 需要得到数据之后渲染